<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">   
	<h:head>
		<title>Basic Arithmetic</title>
		<link href="../../08/css/styles.css" rel="stylehseet" type="text/css" />
	</h:head> 
	<body> 
		<h:form>
			<fieldset>
				<legend>Basic Arithmetic Operations - Sum</legend>
				Number 1:
					<h:inputText value="#{arithmetic.number1}" id="num1Field">
						<f:ajax execute="num2Field" event="keyup" render="sumField"/>
					</h:inputText>
				<br/>
				Number 2:
					<h:inputText value="#{arithmetic.number2}" id="num2Field">
						<f:ajax execute="num1Field" event="keyup" render="sumField num1Field" />
					</h:inputText>
				<br/>
				Result: <h:outputText value="#{arithmetic.sum}" id="sumField"/>
			</fieldset>
		</h:form>
	</body> 
</html>